<template>
	<view class="child">
		我是子组件,接收父组件的值: {{message}}
		<view>子组件值将传递给父组件: {{cMsg}}</view>
		<slot name="header"></slot>
		<slot name="main"></slot>
		<slot name="footer"></slot>
		<button @click="changeData" size="mini" type="primary">给父组件传值</button>
	</view>
</template>

<script>
	export default {
		props:{
			message: {
				type: String,
				default: '等待父组件的值',
				required: true
			}
		},
		data() {
			return {
				cMsg: "来自子组件的值"
			};
		},
		methods:{
			changeData () {
				this.$emit('newData', this.cMsg)
			}
		}
	}
</script>

<style lang="scss">
	.child{
		width: 90%;
		height: 400rpx;
		background-color: lightblue;
		margin: 40rpx 5%;
	}
</style>
